
<!-- W-Playlist -->

<ol class="widget w-playlist">
	<li class="js-open-popup" data-popup-target=".playlist-popup">
		<div class="playlist-thumb" data-toggle="tooltip" data-placement="top" title="PLAY / ADD TO PLAYER">
			<img src="img/playlist16.jpg" alt="thumb-composition">
			<div class="overlay"></div>
			<a href="#" class="play-icon">
				<svg class="olymp-music-play-icon-big"><use xlink:href="svg-icons/sprites/icons-music.svg#olymp-music-play-icon-big"></use></svg>
			</a>
		</div>

		<div class="composition">
			<a href="#" class="composition-name">The Juggler</a>
			<a href="#" class="composition-author">Poison Apple</a>
		</div>

		<div class="composition-time">
			<time class="published" datetime="2017-03-24T18:18">5:17</time>
			<div class="more"><svg class="olymp-three-dots-icon"><use xlink:href="svg-icons/sprites/icons.svg#olymp-three-dots-icon"></use></svg>
				<ul class="more-dropdown">
					<li>
						<a href="#">Add Song to Player</a>
					</li>
					<li>
						<a href="#">Add Playlist to Player</a>
					</li>
				</ul>
			</div>
		</div>

	</li>

	<li class="js-open-popup" data-popup-target=".playlist-popup">
		<div class="playlist-thumb" data-toggle="tooltip" data-placement="top" title="PLAY / ADD TO PLAYER">
			<img src="img/playlist17.jpg" alt="thumb-composition">
			<div class="overlay"></div>
			<a href="#" class="play-icon">
				<svg class="olymp-music-play-icon-big"><use xlink:href="svg-icons/sprites/icons-music.svg#olymp-music-play-icon-big"></use></svg>
			</a>
		</div>

		<div class="composition">
			<a href="#" class="composition-name">Leap of Faith</a>
			<a href="#" class="composition-author">Eden Artifact</a>
		</div>

		<div class="composition-time">
			<time class="published" datetime="2017-03-24T18:18">8:24</time>
			<div class="more"><svg class="olymp-three-dots-icon"><use xlink:href="svg-icons/sprites/icons.svg#olymp-three-dots-icon"></use></svg>
				<ul class="more-dropdown">
					<li>
						<a href="#">Add Song to Player</a>
					</li>
					<li>
						<a href="#">Add Playlist to Player</a>
					</li>
				</ul>
			</div>
		</div>

	</li>
	<li class="js-open-popup" data-popup-target=".playlist-popup">
		<div class="playlist-thumb" data-toggle="tooltip" data-placement="top" title="PLAY / ADD TO PLAYER">
			<img src="img/playlist18.jpg" alt="thumb-composition">
			<div class="overlay"></div>
			<a href="#" class="play-icon">
				<svg class="olymp-music-play-icon-big"><use xlink:href="svg-icons/sprites/icons-music.svg#olymp-music-play-icon-big"></use></svg>
			</a>
		</div>

		<div class="composition">
			<a href="#" class="composition-name">Bat Tornado</a>
			<a href="#" class="composition-author">The Revengers</a>
		</div>

		<div class="composition-time">
			<time class="published" datetime="2017-03-24T18:18">4:57</time>
			<div class="more"><svg class="olymp-three-dots-icon"><use xlink:href="svg-icons/sprites/icons.svg#olymp-three-dots-icon"></use></svg>
				<ul class="more-dropdown">
					<li>
						<a href="#">Add Song to Player</a>
					</li>
					<li>
						<a href="#">Add Playlist to Player</a>
					</li>
				</ul>
			</div>
		</div>

	</li>
	<li class="js-open-popup" data-popup-target=".playlist-popup">
		<div class="playlist-thumb" data-toggle="tooltip" data-placement="top" title="PLAY / ADD TO PLAYER">
			<img src="img/playlist19.jpg" alt="thumb-composition">
			<div class="overlay"></div>
			<a href="#" class="play-icon">
				<svg class="olymp-music-play-icon-big"><use xlink:href="svg-icons/sprites/icons-music.svg#olymp-music-play-icon-big"></use></svg>
			</a>
		</div>

		<div class="composition">
			<a href="#" class="composition-name">Top Pressure</a>
			<a href="#" class="composition-author">Jason Bowie</a>
		</div>

		<div class="composition-time">
			<time class="published" datetime="2017-03-24T18:18">3:21</time>
			<div class="more"><svg class="olymp-three-dots-icon"><use xlink:href="svg-icons/sprites/icons.svg#olymp-three-dots-icon"></use></svg>
				<ul class="more-dropdown">
					<li>
						<a href="#">Add Song to Player</a>
					</li>
					<li>
						<a href="#">Add Playlist to Player</a>
					</li>
				</ul>
			</div>
		</div>

	</li>
	<li class="js-open-popup" data-popup-target=".playlist-popup">
		<div class="playlist-thumb" data-toggle="tooltip" data-placement="top" title="PLAY / ADD TO PLAYER">
			<img src="img/playlist20.jpg" alt="thumb-composition">
			<div class="overlay"></div>
			<a href="#" class="play-icon">
				<svg class="olymp-music-play-icon-big"><use xlink:href="svg-icons/sprites/icons-music.svg#olymp-music-play-icon-big"></use></svg>
			</a>
		</div>

		<div class="composition">
			<a href="#" class="composition-name">Night Troopers</a>
			<a href="#" class="composition-author">Iron Maid</a>
		</div>

		<div class="composition-time">
			<time class="published" datetime="2017-03-24T18:18">5:54</time>
			<div class="more"><svg class="olymp-three-dots-icon"><use xlink:href="svg-icons/sprites/icons.svg#olymp-three-dots-icon"></use></svg>
				<ul class="more-dropdown">
					<li>
						<a href="#">Add Song to Player</a>
					</li>
					<li>
						<a href="#">Add Playlist to Player</a>
					</li>
				</ul>
			</div>
		</div>

	</li>
</ol>

<!-- ... end W-Playlist -->